<!DOCTYPE html>
<html lang="en" style="">
<head>
<!--shared:Meta-->
<base href="">
<style>
/*vfs[]:/css/highlight.css*/
</style>
<script>
let DEBUG = false
DEBUG = true /*debug*/
</script>
<style>
/*file:css/app.css */
/*shared:css/ui.css */
</style>
</head>
<body class="loading noauth">
<div class="when-loading"></div>
<div v-scope class="app">
<div class="flex">
    <div id="sidebar" v-scope="Sidebar({ store, routes })"></div>
    <div class="md:pl-sidebar md:w-sidebar overflow-auto flex flex-col flex-1">
        <div class="sticky top-0 z-10 md:hidden pl-1 pt-1 sm:pl-3 sm:pt-3 bg-white">
            <button type="button" @click="transition('sidebar')"    
                    class="-ml-0.5 -mt-0.5 h-12 w-12 inline-flex items-center justify-center rounded-md text-gray-500 hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500">
                <span class="sr-only">Open sidebar</span>
                <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
                </svg>
            </button>
        </div>
        <main class="flex-1">
            <div class="pt-2.5 pb-6">
                <div v-if="plugins.auth" v-scope="AuthNav({ auth:() => store.auth, logout:() => store.logout() })" class="absolute top-1 right-2"></div>
                <div v-if="store.op">
                    <div class="fixed w-full md:w-sidebar border-b border-gray-200 bg-white top-sm-nav" style="padding-top:2.5px">
                        <nav class="flex max-w-screen-sm lg:max-w-screen-md" aria-label="Tabs">
                            <a v-for="(tab,name) in store.opTabs" v-href="{tab}" :title="name"
                               :class="[tab == routes.tab ? 'border-indigo-500 text-indigo-600' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300','w-1/3 py-5 px-1 text-center border-b-2 font-medium text-sm overflow-hidden']">
                                {{name}}
                            </a>
                        </nav>
                    </div>
                    <div class="fixed w-body md:w-body top-top-nav h-top-nav overflow-auto">
                        <div v-if="routes.tab === ''" v-scope="ApiForm({ store, routes })"></div>
                        <div v-else-if="routes.tab === 'details'" class="flex" v-scope="ApiDetails({ store, routes, breakpoints })"></div>
                        <div v-else-if="routes.tab === 'code'" v-scope="ApiCode({ store, routes })"></div>
                    </div>
                </div>
                <div class="fixed w-body md:w-body top-top-nav h-top-nav overflow-auto" v-else v-scope="Welcome({ store })"></div>
            </div>
        </main>
    </div>
</div>
</div>
<script src="../js/require.js?vfx=hash"></script>
<script src="../js/servicestack-client.js?vfx=hash"></script>
<script src="../types/js?vfx=hash"></script>
<script>
Object.assign(window, exports)
/*shared/js:core */
function loadApp(app) { window.APP = app }
function loadAuth(auth) { 
    window.AUTH = !auth || auth.responseStatus ? null : auth
    setBodyClass({ auth })
}
</script>
<script src="../metadata/app?callback=loadApp&jsconfig=eccn"></script>
<script src="../auth?callback=loadAuth&jsconfig=eccn"></script>
<script src="../js/petite-vue.js?vfx=hash"></script>
<script>
document.title = APP.app.serviceName
setFavIcon(APP.ui.brandIcon, combinePaths(APP.app.baseUrl, '/metadata/svg/servicestack.datauri'))
/*shared/js:PetiteVueApp */
let App = new PetiteVueApp()
/*plugins:* */
/*files:js/*.js */
</script>
<!--shared:Alert,AuthNav,Brand,CloseButton,CopyIcon,CopyLine,Image,Input,Loading,PreviewObject,SignIn,ErrorSummary-->
<!--files:components/*.html-->
<!--files:docs/*.html-->
<script minify>
let docComponents = window.APP.api.operations.map(op => op.request.name).filter(name => window[name + 'Docs'])
document.write(`<template id='doc-component-template'><div v-if="false"></div>`)
docComponents.forEach(x => {
    document.write(`<div v-else-if="routes.op === '${x}'" v-scope="${x}Docs({ op:() => op, store, routes, breakpoints })"></div>`)
})
document.write(`</template>`)
App.components({
    DocComponent() {
        return {
            $template: '#doc-component-template',
            store, routes, breakpoints,
            get op() { return APP.api.operations.find(op => op.request.name === routes.op) }
        }
    }
})
</script>
<script src="../js/highlight.js?vfx=hash"></script>
<script>
App.directive('highlightjs', ({ effect, get, el}) => {
    effect(() => {
        let src = get()
        if (src) {
            el.className = '' // remove existing stale class
            el.innerHTML = enc(src)
            hljs.highlightElement(el)
        }
    })
})
App.build({
    app: APP.app,
    ui: APP.ui,
    serviceName: APP.app.serviceName,
    get plugins() { return APP.plugins },
    get api() { return APP.api },
    langs: {
        csharp: "C#",
        typescript: "TypeScript",
        dart: "Dart",
        java: "Java",
        kotlin: "Kotlin",
        python: "Python",
        swift: "Swift",
        vbnet: "VB.NET",
        fsharp: "F#",
    },
    store,
    get request() { return this.store.op && this.store.op.request },
    humanify,
    typeName,
    typeName2,
}).mount()
$1('.when-loading').appendChild($1('#loading-template').content.cloneNode(true))
let sidebarWidth = styleProperty('--sidebar-width')
App.start()
App.nextTick(() => {
    document.body.classList.remove('loading')
    let max = Math.max(...Array.from($$('#sidebar .nav-item')).map(el => el.clientWidth))
    if (max > (240 - 75)) {
       sidebarWidth = (max + 75) + 'px'
       setStyleProperty({ '--sidebar-width': sidebarWidth })
    }
})
</script>
</body>
</html>
